<template>
  <el-dialog
    v-el-drag-dialog
    :title="'催单'"
    :visible.sync="visible"
    width="700px"
    @closed="reset"
  >
    <div class="diglog_urge">

      <div style="padding: 10px 10px; box-sizing: border-box;">
        <el-radio v-model="radio" style="width: 100%;" label="1">立即送达</el-radio>
        <el-radio v-model="radio" style="width: 100%; margin-top: 20px;" label="2">半小时内送达</el-radio>
        <el-radio v-model="radio" style="width: 100%; margin-top: 20px;" label="3">一小时内送达</el-radio>
        <el-input v-model="remark" style="margin-top: 20px;" type="textarea" :rows="4" maxlength="255" show-word-limit />
        <el-button style="float: right; margin-top: 20px;" :loading="$loadingPlugin.add || $loadingPlugin.edit" type="primary" @click="success">确定</el-button>
      </div>
      <div class="record" style="margin-top: 50px;">
        催单记录
      </div>
    </div>
  </el-dialog>
</template>

<script>
  import { } from '@/api'

  export default {
    name: 'urge',

    data() {
      return {
        temp: {

        },
        visible: false,
        radio: null,
        remark: null
      }
    },
    methods: {
      open(temp) {
        return new Promise(resolve => {
          this.resolve = resolve
          this.visible = true
          if (temp) {
            this.temp = Object.assign(this.temp, temp)
            this.type = 'edit'
          }
        })
      },
      success() {
        this.visible = false
      },
      async add() {
        // await roleAdd(this.temp)
        this.resolve()
        this.visible = false
        this.$notify({
          title: '提示',
          message: '新增成功',
          type: 'success',
          duration: 2000
        })
      },
      async edit() {
        // await roleUpdate(this.temp)
        this.resolve(this.temp)
        this.visible = false
        this.$notify({
          title: '提示',
          message: '更新成功',
          type: 'success',
          duration: 2000
        })
      },
      reset() {

      }
    }
  }
</script>

<style lang="scss" scoped>
.form {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  & /deep/ .el-form-item {
    width: 48%;
    .el-form-item__content > .el-select {
      width: 100%;
    }
  }
  .block {
    width: 100%;
  }
}
.info-title {
  display: flex;
  align-items: center;
  margin-top: 10px;
  margin-bottom: 20px;
  .title-icon {
    display: inline-block;
    width: 4px;
    height: 18px;
    margin-right: 6px;
    background: $themeColor;
  }
  span {
    font-weight: 700;
    color: $themeColor;
  }
}
.diglog_urge {
  box-sizing: border-box;
  // height: 500px;
  // overflow: auto
}
.record {
  height: 300px;
  overflow: auto;
}
</style>
